<!DOCTYPE html>
<html lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>resume-management</title>
    <link rel="stylesheet" type="text/css" href="${contextPath}/resources/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="${contextPath}/resources/css/datepicker.css">
    <script src="${contextPath}/resources/js/lib/jquery-1.11.3.js"></script>
    <script src="${contextPath}/resources/js/lib/bootstrap.js"></script>
    <script src="${contextPath}/resources/js/lib/bootstrap-datepicker.js"></script>
    <script>
    var MODELS = {
        DOMAIN_PATH: '${contextPath}',
        ID: '${user.id}'
    }
    </script>
    <script src="${contextPath}/resources/js/biz/seeker-index.js"></script>
</head>
<style>
.navbar .breadcrumb {
    margin: 0 7px;
    background-color: #f8f8f8;
    font-size: 1.2em;
    font-weight: bold;
}

@media (min-width: 768px) {
    .navbar .breadcrumb {
        float: left;
        margin: 7px 10px;
    }
}
</style>

<body>
    <nav class="navbar navbar-default">
        <div class="container">
            <ol class="breadcrumb">
                <li class="active">简历平台</li>
                <li class="active">求职者</li>
            </ol>
            <ul class="nav navbar-nav navbar-right">
                <li><a href="#" id="tpl-switch">选择模板</a></li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-user"></span> ${user.name} <span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="${contextPath}/seeker/logout">退出</a></li>
                    </ul>
                </li>
            </ul>
        </div>
        </div>
    </nav>
    <div class="container">
        <div class="col-sm-3">
            <div class="panel panel-default" id="module-switch">
                <div class="panel-heading" style="font-size: 20px;">简历模块</div>
                <div class="list-group">
                    <a href="#" class="list-group-item active" data-module="#basic-info"><span class="glyphicon glyphicon-user" style="margin-right: 30px;"></span>基本信息</a>
                    <a href="#" class="list-group-item" data-module="#education"><span class="glyphicon glyphicon-education" style="margin-right: 30px;"></span>教育背景</a>
                    <a href="#" class="list-group-item" data-module="#work-experience"><span class="glyphicon glyphicon-briefcase" style="margin-right: 30px;"></span>工作经历</a>
                    <a href="#" class="list-group-item" data-module="#project-experience"><span class="glyphicon glyphicon-stats" style="margin-right: 30px;"></span>项目经验</a>
                    <a href="#" class="list-group-item" data-module="#self-desc"><span class="glyphicon glyphicon-sunglasses" style="margin-right: 30px;"></span>自我描述</a>
                    <a href="#" class="list-group-item" data-module="#skill"><span class="glyphicon glyphicon-list-alt" style="margin-right: 30px;"></span>技能评价</a>
                    <a href="#" class="list-group-item" data-module="#disire"><span class="glyphicon glyphicon-send" style="margin-right: 30px;"></span>期望工作</a>
                </div>
            </div>
        </div>
        <div class="col-md-9">
            <div class="row" id="basic-info">
                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="col-md-4 col-md-offset-5">
                            <a href="#" class="thumbnail" style="width: 100px; height: 100px; position: relative; overflow: hidden;">
                                <img src="" style="width: 100%; height: 100%;">
                                <input type="file" accept="image/*" style="position: absolute; top: 0; right: 0; min-width: 100%; min-height: 100%; opacity: 0; cursor: inherit; outline: none;">
                            </a>
                        </div>
                        <div class="clearfix"></div>
                        <form class="form-horizontal">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">姓名</label>
                                <div class="col-sm-10">
                                    <input class="form-control" type="text" class="form-control">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">性别</label>
                                <div class="col-sm-10">
                                    <select class="form-control" style="width: 15%;">
                                        <option value="0">男</option>
                                        <option value="1">女</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">生日</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control date-birthday" placeholder="yyyy-mm">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">毕业学校</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">主修专业</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">学历</label>
                                <div class="col-sm-10">
                                    <select class="form-control" style="width: 25%;">
                                        <option value="0">大专</option>
                                        <option value="1">本科</option>
                                        <option value="2">硕士</option>
                                        <option value="3">博士</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">工作时间</label>
                                <div class="col-sm-10">
                                    <select class="form-control" style="width: 25%;">
                                        <option value="0">应届生</option>
                                        <option value="1">1年</option>
                                        <option value="2">2年</option>
                                        <option value="3">3年</option>
                                        <option value="4">4年</option>
                                        <option value="5">5年</option>
                                        <option value="6">5年以上</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">手机号码</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">常用邮箱</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">现在城市</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control">
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="panel-footer" style="text-align: right;">
                        <button type="button" class="btn btn-primary">更新</button>
                    </div>
                </div>
            </div>
            <div class="row" id="education" style="display: none;">
                <div class="col-md-6">
                    <a href="" class="thumbnail text-center" style="height: 332px;">
                        <span class="glyphicon glyphicon-plus" style="font-size: 10em; margin-top: 75px; width: 100%;"></span>
                    </a>
                </div>
            </div>
            <div class="row" id="work-experience" style="display: none;">
                <div class="col-md-6">
                    <a href="#" class="thumbnail text-center" style="height: 363px;">
                        <span class="glyphicon glyphicon-plus" style="font-size: 10em; margin-top: 90px; width: 100%;"></span>
                    </a>
                </div>
            </div>
            <div class="row" id="project-experience" style="display: none;">
                <div class="col-md-6">
                    <a href="#" class="thumbnail text-center" style="height: 363px;">
                        <span class="glyphicon glyphicon-plus" style="font-size: 10em; margin-top: 90px; width: 100%;"></span>
                    </a>
                </div>
            </div>
            <div class="row" id="self-desc" style="display: none;">
            </div>
            <div class="row" id="skill" style="display: none;">
                <div class="col-md-6">
                    <a href="#" class="thumbnail text-center" style="height: 185px;">
                        <span class="glyphicon glyphicon-plus" style="font-size: 10em; margin-top: 15px; width: 100%;"></span>
                    </a>
                </div>
            </div>
            <div class="row" id="disire" style="display: none;">
            </div>
        </div>
    </div>
    <div class="modal fade" id="confirm-modal">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-header">
                    <button class="close" data-dismiss="modal"><span>&times;</span></button>
                    <h4 class="modal-title">确认</h4>
                </div>
                <div class="modal-body">
                    确定当前操作 ?
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary">确定</button>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="msg-modal">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-header">
                    <button class="close" data-dismiss="modal"><span>&times;</span></button>
                    <h4 class="modal-title">提示</h4>
                </div>
                <div class="modal-body">
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">确定</button>
                </div>
            </div>
        </div>
    </div>
    <style>
        .thumbnail img {
            width: 250px;
            height: 300px;
        }
        .caption .glyphicon-thumbs-up {
            font-size: 1.5em;
            font-weight: bold;
            margin-top: 4px;
        }
        .caption {
            margin-bottom: -5px;
        }
    </style>
    <div class="modal fade" id="tpl-modal">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button class="close" data-dismiss="modal"><span>&times;</span></button>
                    <h4 class="modal-title">模板选择</h4>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-4 col-sm-6">
                            <div class="thumbnail">
                                <img src="${contextPath}/resources/img/public/tpl_1.PNG">
                                <div class="caption">
                                    <span class="glyphicon glyphicon-thumbs-up">1</span>
                                    <div class="btn-group pull-right">
                                        <a href="${contextPath}/seeker/${user.id}/template/1/preview" target="_blank" class="btn btn-info"><span class="glyphicon glyphicon-eye-open"> 预览</span></a>
                                        <a href="${contextPath}/seeker/${user.id}/template/1/pdf" target="_blank" class="btn btn-primary"><span class="glyphicon glyphicon-cloud-download"> 下载</span></a>
                                    </div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4 col-sm-6">
                            <div class="thumbnail">
                                <img src="${contextPath}/resources/img/public/tpl_2.PNG">
                                <div class="caption">
                                    <span class="glyphicon glyphicon-thumbs-up">1</span>
                                    <div class="btn-group pull-right">
                                        <a href="${contextPath}/seeker/${user.id}/template/2/preview" target="_blank" class="btn btn-info"><span class="glyphicon glyphicon-eye-open"> 预览</span></a>
                                        <a href="${contextPath}/seeker/${user.id}/template/2/pdf" target="_blank" class="btn btn-primary"><span class="glyphicon glyphicon-cloud-download"> 下载</span></a>
                                    </div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4 col-sm-6">
                            <div class="thumbnail">
                                <img src="${contextPath}/resources/img/public/tpl_3.PNG">
                                <div class="caption">
                                    <span class="glyphicon glyphicon-thumbs-up">1</span>
                                    <div class="btn-group pull-right">
                                        <a href="${contextPath}/seeker/${user.id}/template/3/preview" target="_blank" class="btn btn-info"><span class="glyphicon glyphicon-eye-open"> 预览</span></a>
                                        <a href="${contextPath}/seeker/${user.id}/template/3/pdf" target="_blank" class="btn btn-primary"><span class="glyphicon glyphicon-cloud-download"> 下载</span></a>
                                    </div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4 col-sm-6">
                            <div class="thumbnail">
                                <img src="${contextPath}/resources/img/public/tpl_4.PNG">
                                <div class="caption">
                                    <span class="glyphicon glyphicon-thumbs-up">1</span>
                                    <div class="btn-group pull-right">
                                        <a href="${contextPath}/seeker/${user.id}/template/4/preview" target="_blank" class="btn btn-info"><span class="glyphicon glyphicon-eye-open"> 预览</span></a>
                                        <a href="${contextPath}/seeker/${user.id}/template/4/pdf" target="_blank" class="btn btn-primary"><span class="glyphicon glyphicon-cloud-download"> 下载</span></a>
                                    </div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4 col-sm-6">
                            <div class="thumbnail">
                                <img src="${contextPath}/resources/img/public/tpl_5.PNG">
                                <div class="caption">
                                    <span class="glyphicon glyphicon-thumbs-up">1</span>
                                    <div class="btn-group pull-right">
                                        <a href="${contextPath}/seeker/${user.id}/template/5/preview" target="_blank" class="btn btn-info"><span class="glyphicon glyphicon-eye-open"> 预览</span></a>
                                        <a href="${contextPath}/seeker/${user.id}/template/5/pdf" target="_blank" class="btn btn-primary"><span class="glyphicon glyphicon-cloud-download"> 下载</span></a>
                                    </div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4 col-sm-6">
                            <div class="thumbnail">
                                <img src="${contextPath}/resources/img/public/tpl_7.PNG">
                                <div class="caption">
                                    <span class="glyphicon glyphicon-thumbs-up">1</span>
                                    <div class="btn-group pull-right">
                                        <a href="${contextPath}/seeker/${user.id}/template/7/preview" target="_blank" class="btn btn-info"><span class="glyphicon glyphicon-eye-open"> 预览</span></a>
                                        <a href="${contextPath}/seeker/${user.id}/template/7/pdf" target="_blank" class="btn btn-primary"><span class="glyphicon glyphicon-cloud-download"> 下载</span></a>
                                    </div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>

</html>
